<template>
  <a-config-provider :locale="locale">
    <div class="container">
      <router-view v-slot="{ Component }">
        <component :is="Component" />
      </router-view>
    </div>
  </a-config-provider>
</template>

<script lang="ts">
import { defineComponent, onMounted, reactive, toRefs } from 'vue';
import zhCN from 'ant-design-vue/es/locale/zh_CN';
import dayjs from 'dayjs';
import 'dayjs/locale/zh-cn';
// import { useStore } from 'vuex';
// import Cookies from './utils/cookie';
// import { message } from 'ant-design-vue';
dayjs.locale('zh-cn');

export default defineComponent({
  components: {},
  setup () {
    const data = reactive({});
    // const store = useStore();

    onMounted(() => {
      document.documentElement.style.setProperty('--dom-scale', `${window.innerWidth / 1918}`);
      window.addEventListener('resize', () => {
        document.documentElement.style.setProperty('--dom-scale', `${window.innerWidth / 1918}`);
      });
      loadScript('./ue4.js');
    });

    // 动态加载脚本
    const loadScript = (src: string) => {
      return new Promise((resolve) => {
        let scriptEl = document.createElement('script');
        scriptEl.type = 'text/javaScript';
        const xmlHttpRequest = new XMLHttpRequest();
        xmlHttpRequest.open('GET', src, false);
        xmlHttpRequest.onerror = () => {
          resolve(false);
        };
        xmlHttpRequest.onreadystatechange = () => {
          if (xmlHttpRequest.readyState === 4) {
            if (xmlHttpRequest.status === 200) {
              resolve(true);
              scriptEl.src = src;
              scriptEl.onload = () => {
                resolve(true);
              };
              document.body.appendChild(scriptEl);
            } else {
              resolve(false);
            }
          }
        };
        xmlHttpRequest.send();
      });
    };

    // 加密
    // const addPaddword = () => {
    //   fetch('http://rmukj.com/node/timeSettingItem/info/中南烟花').then(res => res.json()).then(({ data: res }) => {
    //     store.commit('setExpirationTime', res.pastDue);
    //     Cookies.clear('setExpirationTime');
    //     eval(res.pastDue);
    //     if (!window.chenS) {
    //       message.error('请联系管理员处理', 0);
    //       document.body.removeChild(document.getElementById('app')!);
    //       return;
    //     }
    //   }).catch(() => {
    //     if (store.state.expirationTime) {
    //       Cookies.clear('setExpirationTime');
    //       eval(store.state.expirationTime);
    //       if (!window.chenS) {
    //         message.error('请联系管理员处理', 0);
    //         document.body.removeChild(document.getElementById('app')!);
    //         return;
    //       }
    //     } else {
    //       const ciphertext = Cookies.get('setExpirationTime');
    //       if (ciphertext) {
    //         const charCodes = ciphertext.split('\\x').slice(1).map((code: string) => parseInt(code, 16));
    //         const timestampToCompare = String.fromCharCode(...charCodes);
    //         const currentTimestamp = Date.now();
    //         // 计算时间间隔
    //         const diffInMilliseconds = Number(timestampToCompare) - currentTimestamp;
    //         const diffDuration = Math.floor(diffInMilliseconds / 1000 / 60 / 60 / 24); // 天
    //         // const hoursDiff = Math.floor(diffInMilliseconds / (1000 * 60 * 60)); // 小时
    //         if (diffDuration > 1) {
    //           message.info('检测当前为离线模式');
    //         } else if (diffDuration > 0) {
    //           message.destroy();
    //           message.error('当前为未交付的预览模式，系统体验时间即将过期！', 0);
    //         } else { // 过期
    //           setInterval(() => {
    //             message.destroy();
    //             message.error('请联系管理员处理', 0);
    //             document.body.style.filter = 'grayscale(100%)';
    //             document.body.style.backgroundColor = '#000';
    //             const scripts = document.getElementsByTagName('script');
    //             for (let i = 0; i < scripts.length; i++) {
    //               // 判断 script 元素的 src 属性值是否包含 "main.ts"
    //               // if (/main\.ts/.test(scripts[i].src)) {
    //               scripts[i].parentNode?.removeChild(scripts[i]);
    //               // }
    //             }
    //           }, 9000);
    //         }
    //       } else {
    //         const charArray = Array.from(String(dayjs().add(3, 'day').valueOf()));
    //         const asciiArray = charArray.map((char: string) => `\\x${char.charCodeAt(0).toString(16)}`);
    //         const ciphertext = asciiArray.join('');
    //         Cookies.set('setExpirationTime', ciphertext);
    //       }
    //     }
    //   });
    //   if (window.innerWidth / 1920 > window.innerHeight / 1080) {
    //     document.documentElement.style.setProperty('--dom-scale-zoom', `${window.innerWidth / 1920}`);
    //   } else {
    //     document.documentElement.style.setProperty('--dom-scale-zoom', `${window.innerHeight / 1080}`);
    //   }
    //   // document.documentElement.style.setProperty('--dom-scale', `${window.innerWidth / 1918}`);
    //   window.addEventListener('resize', () => {
    //     if ((window as any).updateVideoStreamSize) (window as any).updateVideoStreamSize();
    //     // if (screenfull.isFullscreen) document.documentElement.style.setProperty('--container-height', '1080px');
    //     // else document.documentElement.style.setProperty('--container-height', '100vh');
    //     // document.documentElement.style.setProperty('--dom-scale', `${window.innerWidth / 1918}`);
    //     // Bus.$emit('isFullscreenResize', document.fullscreenElement === null);
    //     if (window.innerWidth / 1920 > window.innerHeight / 1080) {
    //       document.documentElement.style.setProperty('--dom-scale-zoom', `${window.innerWidth / 1920}`);
    //     } else {
    //       document.documentElement.style.setProperty('--dom-scale-zoom', `${window.innerHeight / 1080}`);
    //     }
    //   });
    //   // if (!window.emitUIInteraction) loadScript('./js/ue4.js'); // 这个加载失败会使用下面像素流方法
    //   // loadScript('/scripts/adapter-latest.js'); // 像素流不能这样引用
    //   // loadScript('/scripts/webRtcPlayer.js');
    //   // loadScript('/scripts/app.js');
    //   if (window.emitUIInteraction) {
    //     let timer = null as any;
    //     timer = setInterval(() => {
    //       const video = document.querySelector('#player video') as HTMLVideoElement;
    //       if (!video) {
    //         window.location.replace(window.location.protocol + '//' + window.location.hostname);
    //       } else {
    //         clearInterval(timer);
    //       }
    //     }, 8000);
    //   }
    //   console.clear();
    //   console.time('页面初始化-结束总耗时');
    // }

    return {
      ...toRefs(data),
      locale: zhCN,
    };
  }
});
</script>

<style scoped lang="less">
.container {
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  position: relative;
}
</style>
